<template>
  <table width="100%" class="cartTable" cellspacing="0" cellpadding="10px">
      <MyHeader :value="checkAll" @input="changeThis"/>
      <tr class="row" v-for="item in list" :key="item.id">
        <td><input :checked="item.isSelected" type="checkbox" name="" class="choose" @change="changeList(item.id)"></td>
        <td class="tal"><a href="#" class="pic"><img :src="item.img" alt="" width="150px" height="150px"></a>
        </td>
        <td class="tal"><a href="#">{{ item.name }}</a></td>
        <td>
          <del class="tdl">{{ item.oldPrice }}</del>
          <br>
          <b class="unit">{{ item.price }}</b>
        </td>
        <td>
          <div class="amount">
            <a href="#" class="Increase" @click="addCount(item.id)">+</a>
            <input type="text" :value="item.count" class="unum" >
            <a href="#" class="Reduce"   @click="item.count?delCount(item.id):''">-</a>
          </div>
        </td>
        <td><b class="u-price">{{item.price*item.count}}</b></td>
        <td><a href="#" class="btn-del" @click="removeList(item.id)">删除</a></td>
      </tr>

      <MyPrice v-model="value" :checkList="checkList" :allPrice="allPrice" :preferential="preferential" @removeAll="removeAll" :anyList="anyList" />
      <!-- <button @click="fn">点击</button> -->
    </table>

</template>

<script>
import MyHeader from '@/components/MyHeader.vue'
import MyPrice from './MyPrice.vue'
export default {
  components:{
    MyPrice,MyHeader
  },
  name: 'MyBody',
  props: {
    list:{
      type:Array,
      required:true
    },
   value:{
    type:Number,
    required:true
   },
   checkList:{
    type:Number,
    required:true
   },
   allPrice:{
    type:Number,
    required:true
   },
   preferential:{
    type:Number,
    required:true
   },
   checkAll:{
    type:Boolean
   },
   anyList:{
       type:Boolean
   }
  },
  data(){
    return{
      count:0
    }
  },
  methods:{
addCount(id){
  this.$emit('addCount',id)
},
delCount(id){
    this.$emit('delCount',id)
},
changeList(id){
  this.$emit('changeList',id)
},
removeList(id){
  this.$emit('removeList',id)
},
changeThis(value){
  this.$emit('changeAll',value)
},
removeAll(){
  this.$emit('removeAll')
}
  }
}
</script>

<style  lang="less"></style>